// uno.config.ts
import { defineConfig, presetUno, presetAttributify, presetTypography } from "unocss";

export default defineConfig({
  presets: [
    presetUno({
      dark: "class" // 使用class模式的暗色主题
    }),
    presetAttributify(),
    presetTypography()
  ],
  theme: {
    colors: {
      primary: {
        50: "#f0fcfd",
        100: "#ccf7fa",
        200: "#99eff4",
        300: "#5ee1ea",
        400: "#3bdbe4", // 主题色
        500: "#1fb5c4",
        600: "#1a92a5",
        700: "#1c7486",
        800: "#1e5f6e",
        900: "#1e4f5d",
        950: "#0f323f"
      },
      gray: {
        50: "#f9fafb",
        100: "#f3f4f6",
        200: "#e5e7eb",
        300: "#d1d5db",
        400: "#9ca3af",
        500: "#6b7280",
        600: "#4b5563",
        700: "#374151",
        800: "#1f2937",
        900: "#111827",
        950: "#030712"
      }
    },
    breakpoints: {
      sm: "640px",
      md: "768px",
      lg: "1024px",
      xl: "1280px",
      "2xl": "1536px"
    }
  },
  shortcuts: [
    // 主题色快捷方式
    [
      "btn-primary",
      "bg-primary-400 hover:bg-primary-500 text-white px-4 py-2 rounded-md font-medium transition-colors"
    ],
    [
      "btn-secondary",
      "bg-gray-200 dark:bg-gray-700 hover:bg-gray-300 dark:hover:bg-gray-600 text-gray-800 dark:text-gray-200 px-4 py-2 rounded-md font-medium transition-colors"
    ],
    [
      "card",
      "bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700"
    ],
    [
      "input",
      "w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 placeholder-gray-500 dark:placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary-400 focus:border-transparent"
    ],
    // 文本颜色
    ["text-primary", "text-gray-900 dark:text-gray-100"],
    ["text-secondary", "text-gray-600 dark:text-gray-400"],
    ["text-muted", "text-gray-500 dark:text-gray-500"]
  ],
  safelist: [
    // 确保常用的类始终包含在构建中
    "dark",
    "light",
    "bg-primary-400",
    "bg-primary-500",
    "text-primary-400",
    "bg-gray-50",
    "bg-gray-100",
    "bg-gray-800",
    "bg-gray-900",
    "text-gray-800",
    "text-gray-400",
    "text-gray-500",
    "border-gray-200",
    "border-gray-700"
  ],
  rules: [
    // 保留原有的自定义规则
    [/^m-([.\d]+)$/, ([_, num]) => ({ margin: `${num}px` })],
    [/^p-([.\d]+)$/, ([_, num]) => ({ padding: `${num}px` })],
    [/^mt-([.\d]+)$/, ([_, num]) => ({ "margin-top": `${num}px` })],
    [/^mb-([.\d]+)$/, ([_, num]) => ({ "margin-bottom": `${num}px` })],
    [
      /^abs-([.\d]+)$/,
      ([_, num]) => ({
        position: "absolute",
        top: `${num}px`,
        left: `${num}px`,
        right: `${num}px`,
        bottom: `${num}px`
      })
    ],
    // 主题色相关规则
    ["bg-primary", { "background-color": "#3bdbe4" }],
    ["text-primary-theme", { color: "#3bdbe4" }],
    ["border-primary", { "border-color": "#3bdbe4" }]
  ]
});
